<template>
  <div class="ddcl_box">
    <div class="ddcl">
      <div class="head_clos">
        <h2>订单处理</h2>
        <span>
          <a-icon class="close" @click="close" type="close" />
        </span>
      </div>
      <div class="ddcl_inp">
        <ul>
          <li>
            <span class="inp_tit">状态：</span>
            <span>
              {{ddzt}}
              <!-- <a-tag class="ddzt" color="#f50" v-if="ddzt=='待支付'">{{ddzt}}</a-tag> -->
              <!-- <a-tag class="ddzt" color="#2db7f5" v-if="ddzt=='已付款'">{{ddzt}}</a-tag>
              <a-tag class="ddzt" color="#87d068" v-if="ddzt=='已发货'">{{ddzt}}</a-tag>
              <a-tag class="ddzt" color="#90989e" v-if="ddzt=='交易关闭'">{{ddzt}}</a-tag>
              <a-tag class="ddzt" color="#d80000" v-if="ddzt=='关闭订单'">{{ddzt}}</a-tag>
              <a-tag class="ddzt" color="#d6d011" v-if="ddzt=='待发货'">{{ddzt}}</a-tag>
              <a-tag class="ddzt" color="#11c4d6" v-if="ddzt=='交易完成'">{{ddzt}}</a-tag>-->
            </span>
          </li>
          <li v-if="$parent.dfhymflag">
            <span class="inp_tit">总金额：</span>

            ￥{{zje}}
          </li>
          <li v-if="$parent.dfhymflag">
            <span class="inp_tit">收款方式：</span>
            <a-select
              :disabled="ly=='云现货'?true:false"
              class="width"
              showSearch
              placeholder="请选择支付方式"
              optionFilterProp="children"
              @focus="handleFocus"
              @blur="handleBlur"
              @change="zfChange"
              :filterOption="filterOption"
              :defaultValue="skfs"
            >
              <a-select-option value="微信支付">微信支付</a-select-option>
              <a-select-option value="线下支付">线下支付</a-select-option>
            </a-select>
          </li>
          <li v-if="$parent.dfhymflag">
            <span class="inp_tit">收款金额：</span>
            <a-input
              :disabled="ly=='云现货'?true:false"
              type="text"
              placeholder="请输入收款金额"
              v-model="skje"
              class="input width"
              onkeyup="if(isNaN(value))execCommand('undo')"
              onafterpaste="if(isNaN(value))execCommand('undo')"
              onKeyPress="if((event.keyCode<48 || event.keyCode>57)&&event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false"
            />
          </li>
          <li v-if="$parent.dfhymflag">
            <span class="inp_tit">收款日期：</span>
            <!-- <a-date-picker class="width" @change="onChange" /> -->
            <a-date-picker
              class="skdate"
              style="width:300px"
              :defaultValue="skdate!=null?moment(skdate):null"
              showTime
              placeholder="收款日期"
              @change="onChange"
              @ok="onOk"
              :disabled="ly=='云现货'?true:false"
            />
          </li>
          <li>
            <span class="inp_tit">运输方式：</span>
            <a-select
              class="width"
              showSearch
              placeholder="请选择运输方式"
              optionFilterProp="children"
              :defaultValue="ysfs"
              @focus="handleFocus"
              @blur="yshandleBlur"
              @change="ysChange"
              :filterOption="filterOption"
            >
              <a-select-option
                v-for="(item,i) in fastMailList"
                :key="i"
                :data-value="item.mailCode"
                :value="item.mailName"
              >{{item.mailName}}</a-select-option>
              <!-- <a-select-option value="双方协商">双方协商</a-select-option>
              <a-select-option value="顺丰">顺丰</a-select-option>
              <a-select-option value="申通">申通</a-select-option>
              <a-select-option value="德邦">德邦</a-select-option>-->
            </a-select>
          </li>
          <li>
            <span class="inp_tit">运单号：</span>
            <a-input type="text" placeholder="请输入运单号" v-model="dh" class="input width" />
          </li>
          <li>
            <span class="inp_tit">发货日期：</span>
            <!-- <a-date-picker class="width" @change="onChange" /> -->
            <a-date-picker
              class="skdate"
              style="width:300px"
              :defaultValue="fhdate!=null?moment(fhdate):moment(new Date())"
              showTime
              placeholder="发货日期"
              @change="fhrqChange"
              @ok="onOk"
            />
          </li>

          <li>
            <span class="inp_tit">当前可执行操作</span>
            <div class="btn">
              <a-button
                v-if="$parent.dfhymflag"
                type="primary"
                :disabled="ddzt=='交易完成'||ddzt=='待发货'||ddzt=='已发货' || ly=='云现货'?true:false"
                @click="confirmsub(1)"
              >确认付款</a-button>
              <a-button
                type="primary"
                :disabled="ddzt=='交易完成'||ddzt=='待支付'||ddzt=='已发货' ?true:false"
                @click="confirmsub(2)"
              >确认发货</a-button>
              <a-button
                v-if="$parent.dfhymflag"
                type="primary"
                :disabled="ddzt=='交易完成' || ly=='云现货'?true:false"
                @click="confirmsub(3)"
              >订单作废</a-button>
              <a-button
                type="primary"
                :disabled="ddzt=='交易完成'||ddzt=='已发货'||ddzt=='已退款'?true:false"
                v-if="ly=='云现货'&&$parent.dfhymflag?true:false"
                @click="querentk"
              >确认退款</a-button>
              <!-- && (ddzt=='待发货' || ddzt=='已发货') -->
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import qs from "qs";
import moment from "moment";

export default {
  // filters: {
  //   formatDate() {
  //     let data = new Date();
  //     return moment(data).format("YYYY-MM-DD hh:mm:ss");
  //   }
  // },
  data() {
    return {
      dateFormat: "YYYY/MM/DD",
      monthFormat: "YYYY/MM",
      ddclval: this.$parent.ddclval,
      ddzt: this.$parent.ddclval.SHBJB,
      ly: this.$parent.ddclval.ly,
      skfs: this.$parent.ddclval.SKFS,
      skje: this.$parent.ddclval.FPSL,
      skdate: this.$parent.ddclval.fkrq,
      ysfs: this.$parent.ddclval.YUNSHUFS,
      dh: this.$parent.ddclval.YUNSHUDH,

      fhdate:
        this.$parent.ddclval.fhrq == null
          ? moment(new Date()).format("YYYY-MM-DD hh:mm:ss")
          : this.$parent.ddclval.fhrq,
      zje: this.$parent.ddclval.zje,

      fastMailList: [],
      mailCode: ""
    };
  },
  components: {},
  methods: {
    moment,
    close() {
      this.$parent.ddclflag = false;
      // this.$parent.dfhymflag = true;
    },
    // onChange(date, dateString) {
    //   console.log(date, dateString);
    // },
    onChange(value, dateString) {
      // console.log('Selected Time: ', value);
      // console.log(dateString);
      this.skdate = dateString;
      console.log(this.skdate);
    },
    fhrqChange(value, dateString) {
      // console.log('Selected Time: ', value);
      // console.log(dateString);
      this.fhdate = dateString;
      console.log(this.fhdate);
    },
    onOk(value) {
      // console.log("onOk: ", value);
    },
    zfChange(value) {
      this.skfs = value;
      console.log(this.skfs);
    },
    ysChange(value) {
      this.ysfs = value;
      if (this.fastMailList.length) {
        for (var i = 0; i < this.fastMailList.length; i++) {
          if (this.fastMailList[i].mailName == value) {
            this.mailCode = this.fastMailList[i].mailCode;
            break;
          }
        }
      }

      console.log(this.mailCode);
    },
    yshandleBlur(e) {
      //console.log(e);
    },
    handleBlur() {
      //console.log("blur");
    },
    handleFocus() {
      //console.log("focus");
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    confirmsub(key) {
      console.log(this.fhdate);
      this.axios
        .post(
          "order/setOrderState.php",
          qs.stringify({
            SQDHDH: this.$parent.ddclval.SQDHDH,
            ddzt: this.ddzt,
            SKFS: this.skfs,
            FPSL: this.skje,
            fkrq: this.skdate,
            YUNSHUFS: this.ysfs,
            YUNSHUFSBM: this.mailCode,
            YUNSHUDH: this.dh,
            fhrq: this.fhdate,
            shbjb: key
          })
        )
        .then(res => {
          console.log(res);
          if (res.data.code == 303) {
            this.$parent.ddclflag = false;

            this.$parent.$parent.getddgl(
              this.$parent.$parent.pagination,
              this.$parent.$parent.serchvalue,
              this.$parent.$parent.tabskey
            );
            // this.$parent.dfhymflag = true;
          }
        });
    },
    //获取运输方式
    getFastMail() {
      this.axios
        .post(
          "order/getFastMail.php",
          qs.stringify({
            gyssqdwid: this.$parent.ddclval.gyssqdwid
          })
        )
        .then(res => {
          console.log(res);
          if (res.data.code == 303) {
            this.fastMailList = res.data.result;
            // for (var i = 0; i < res.data.result.length; i++) {
            //   this.tabslist[i].key = i;
            //   this.tabschil = this.tabslist[i].child;

            //   for (var j = 0; j < this.tabslist[i].child.length; j++) {
            //     this.tabslist[i].child[j].key = i + "_" + j;
            //   }
            // }
            // this.nulldata = "";
          }
        });
    },
    querentk() {
      console.log(this.$parent.ddclval);
      this.axios
        .post(
          "https://xh.bearing.cn/api/wxpay/orderRefund.php",
          qs.stringify({
            phone: this.ddclval.dhrPHONE,
            sqdhdh: this.ddclval.SQDHDH
          })
        )
        .then(res => {
          console.log(res);
          if (res.data.code == 303) {
            this.$notification["success"]({
              message: "成功",
              description: res.data.msg
            });
          } else {
            this.$notification["error"]({
              message: "失败",
              description: res.data.msg
            });
          }
        });
    }
  },

  created() {
    this.getFastMail();
  }
};
</script>

<style lang='less'>
.ddcl_box {
  .ddcl {
    width: 66%;
    height: auto;
    box-shadow: 0px 0px 7px #ccc;
    background-color: #fff;
    margin: 9px auto;
    position: relative;
    top: 63px;
    text-align: left;
    padding: 20px;
    .head_clos {
      display: flex;
      justify-content: space-between;
      .close {
        font-size: 20px;
      }
    }
    .ddcl_inp {
      ul {
        .ant-calendar-time .ant-calendar-footer {
          display: none !important;
        }
       

        li {
          margin: 20px 0;

          .ddzt {
            padding: 5px 15px;
            height: 30px;
            width: 70px;
          }
          .inp_tit {
            display: inline-block;
            width: 100px;
            text-align: right;
          }
          .width {
            width: 300px;
          }
          .btn {
            button {
              margin: 10px;
            }
          }
        }
      }
    }
  }
}
</style>
